// import {Component} from 'react'
import  '../css/adduser.css'

function AddUser() {
    const name="xiaoming"
    function getAge(){
        return 18+'岁'
    }
    const boolean=false
    const dataArr=[
        {
            id:"1",  
            name:"xiaohong",
            age:"18",
        },
        {
            id:"2", 
            name:"xiaoming",
            age:"19",
        },
        {
            id:"3",  
            name:"xiaofanssss",
            age:"17",
        },
    ]
    function clickFm(e,id){
     console.log(e)
     console.log(id)
    }
    return (
     <>
          {/* {name}{getAge()}{boolean==true? '真的' :'假的'} */}
          <ul>
              {/* {
                  dataArr.map((item)=>{
                      return(
                        <li key={item.id}>
                            {item.name}
                         </li>
                      )
                  })
              } */}

              {/* {
                  dataArr.map(item=><li key={item.id}>  {item.name} </li>)
              } */}

              {/* <div style={{color:"red"}}>字体的颜色</div> */}

              {/* <div className="fontColor" >字体的颜色</div> */}

              {/* 
                  <div className={boolean ? "fontColor" :"fontChangeColor"} >字体的颜色</div>
                   动态控制类名 我们就要变量去控制   我们通过控制变量的值来改变类名
              */}

             {
                  dataArr.map(item=><li key={item.id} onClick={(e)=>{clickFm(e,item.id)}} >  {item.name} </li>)
              }

              

              
          </ul>
     </>
    );
  }
  

export default AddUser